<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>推荐管理</title>
    <meta name="renderer" content="webkit">
        <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
        <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
        <meta name="apple-mobile-web-app-status-bar-style" content="black">
        <meta name="apple-mobile-web-app-capable" content="yes">
        <meta name="format-detection" content="telephone=no">
        <link rel="stylesheet" href="./../../static/back/css/x-admin.css" media="all">
</head>
<body>
<div class="x-nav">
            <span class="layui-breadcrumb">
              <a><cite>首页</cite></a>
              <a><cite>推荐列表</cite></a>

            </span>
            <a class="layui-btn layui-btn-small" style="line-height:1.6em;margin-top:3px;float:right"  href="javascript:location.replace(location.href);" title="刷新"><i class="layui-icon" style="line-height:30px">ဂ</i></a>
        </div>
        <script type="text/html" id="barDemo">
			<a class="layui-btn layui-btn-xs" lay-event="setUserEdit" >编辑</a>
			<a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="setUserDel">删除</a>
		</script>

           <!--顶部工具栏-->
		<div style='display: none;' id='mytoolbar'>
            <button class="layui-btn layui-icon" lay-event='batchDel'>批量删除</button>
        </div>

        <div class="x-body">
            <div class="layui-form-item" style="margin-top: 20px;" onsubmit="return false;">
			<form class="layui-form">
                {% csrf_token %}
				<label class="layui-form-label">标题:</label>
				<div class="layui-input-inline" style="width:120px;">
                    <select id="position" name="type">
						<option value="">请选择</option>
                        <option value="1">网站首页</option>
                        <option value="2">关于我</option>
                        <option value="3">我的日记</option>
					</select>

				</div>
                <label class="layui-form-mid">权重：</label>
				<div class="layui-input-inline" style="width:160px;">
					<input type="text" id="minweight" name="txtTitle" autocomplete="off" class="layui-input">
				</div>
				<label class="layui-form-mid">-</label>
				<div class="layui-input-inline" style="width:120px;">
					<input type="text" id="maxweight" name="txtTitle" autocomplete="off" class="layui-input">
				</div>
			</form>
			<button class="layui-btn" id="search" lay-filter="search"  data-type="reload">搜索</button>
		</div>
            <table id="demo" class="layui-hide" lay-filter="test"></table>
        </div>
        <script src="../../../static/back/lib/layui/layui.js" charset="utf-8"></script>
        <script src="../../../static/back/js/x-layui.js" charset="utf-8"></script>
        <script>
            layui.use(['element','table','form','layer','jquery'],function(){
                var table=layui.table,
                    form=layui.form,
                    layer=layui.layer,
                    $=layui.$;
              table.render({
                elem: '#demo'
                  ,toolbar:'#mytoolbar'
                ,url:'/back/getRecomment' //数据接口
                ,method:'get'
                ,where:{'csrfmiddlewaretoken':'{{ csrf_token }}'}
                ,page: true//开启分页
                ,limit:5//每页数据条数
                ,cols: [[//表头
                   {type:'checkbox', fixed:'left'}
                  ,{field:'id', title: '标题',hide: true}
                  ,{field:'title', title: '标题'}
                  ,{field:'posid',  title: '位置'}
                  ,{field:'weight',  title: '权重'}
                  ,{field:'showtype',  title: '分类'}
                  ,{title:'操作',align:'center',toolbar:'#barDemo'}
                  ]],
                  id:'testReload'
              });
                     active = {
                        reload: function(){
                            //传递参数 标题 类别 是否发布
                          var position = $('#position').val();
                          var minweight = $('#minweight').val();
                          var maxweight = $('#maxweight').val();

                          //执行重载
                          table.reload('testReload', {
                            page: {
                              curr: 1 //重新从第 1 页开始
                            }
                            ,where: {
                                  'posid':position,
                                  'min_weight':minweight,
                                  'max_weight':maxweight
                            }
                          }, 'data');
                        }
                      };

                      $('#search').on('click', function(){
                        var type = $(this).data('type');
                        active[type] ? active[type].call(this) : '';
                      });


                //监听头部工具栏事件
				table.on('toolbar(test)',function(obj){
                    var checkStatus = table.checkStatus(obj.config.id)
                        ,data = checkStatus.data; //获取选中的数据
                    if(obj.event=='batchDel'){
					     if(data.length === 0){
                              layer.msg('请至少选择一行');
                            } else {
                             //批量
                             layer.confirm('真的删除行么', function (index) {
                                 ids = '';
                                 for (var i = 0; i < data.length; i++) {
                                     id = data[i].id;
                                     ids += id + ',';
                                 }
                                 ids = ids.substring(0, ids.length - 1)//截取字符串，不要最后一个，
                                 //发起异步请求删除
                                 $.post('/back/reBatchDel/', {'ids': ids}, function (res) {
                                     if (res.success) {
                                         layer.msg('删除成功')
                                         table.reload('testReload', {})//对哪个表格进行重新加载id属性值，参数
                                     } else {
                                         layer.msg(res.message)
                                     }
                                 }, 'json')

                             })
                         }
                    }
				});
				//监听行内工具栏事件
				table.on('tool(test)', function(obj){ //注：tool 是工具条事件名，mytable 是 table 原始容器的属性 lay-filter="对应的值"
					  var data = obj.data; //获得当前行数据
					  var layEvent = obj.event; //获得 lay-event 对应的值（也可以是表头的 event 参数对应的值）
					  var tr = obj.tr; //获得当前行 tr 的 DOM 对象（如果有的话）
					  if(layEvent === 'setUserDel'){ //删除
					    layer.confirm('真的删除行么', function(index){
					          //向服务端发送删除指令  发起异步请求
                                layer.msg('删除')

                            var url='/back/singleDel';
                            param={'id':data.id};
                            $.get(url,param,function (res) {
                                    if(res.success){
                                         table.reload('testReload', {})//对哪个表格进行重新加载id属性值，参数
                                        layer.msg('删除成功')
                                    }else{
                                        layer.msg(res.message)
                                    }
                            },'json')
					    });
					  } else if(layEvent === 'setUserEdit'){ //编辑
					       //do something
					       //layer.msg('编辑')
                          layer.open({
                            type:2,
                            title:'编辑',
                            content:'/back/redactRecomment?aid='+data.id,
                            area:['500px','450px']
                        })
					     }
					});



            })
        </script>


    </body>
</html>